<template>
  <div class="rightTop2">
      <div class="h-title-box">
        <span class="h-title">排行榜</span>
        <dv-decoration-3 class="h-deco"/>
      </div>
      <dv-scroll-board :config="config" class="scroll-board"/>
  </div>
</template>

<script>
export default {
  components: {
  },
  data() {
    return {
       config: {
        header: ["组件", "分支", "覆盖率"],
        data: [
          ["组件1", "dev-1", "<span  class='colorGrass'>↑75%</span>"],
          ["组件2", "dev-2", "<span  class='colorRed'>↓33%</span>"],
          ["组件3", "dev-3", "<span  class='colorGrass'>↑100%</span>"],
          ["组件4", "rea-1", "<span  class='colorGrass'>↑94%</span>"],
          ["组件5", "rea-2", "<span  class='colorGrass'>↑95%</span>"],
          ["组件6", "fix-2", "<span  class='colorGrass'>↑63%</span>"],
          ["组件7", "fix-4", "<span  class='colorGrass'>↑84%</span>"],
          ["组件8", "fix-7", "<span  class='colorRed'>↓46%</span>"],
          ["组件9", "dev-2", "<span  class='colorRed'>↓13%</span>"],
          ["组件10", "dev-9", "<span  class='colorGrass'>↑76%</span>"]
        ],
        rowNum: 7, //表格行数
        headerHeight: 35,
        headerBGC: "#0f1325", //表头
        oddRowBGC: "#0f1325", //奇数行
        evenRowBGC: "#171c33", //偶数行
        index: true,
        columnWidth: [40],
        align: ["center"]
      }
    };
  },

  mounted() {
    
  },
  methods: {
    
  }
};
</script>

<style lang="less" scoped>
.rightTop2{
  width:100%;
  height:100%;
  /deep/.scroll-board{
    height:90%;
    margin-top:5%;
    .colorGrass{
    color:#33cea0
  }
  .colorRed{
    color:#ff5722
  }
  }
  
} 
</style>